
// 导入 axios 库
import axios from 'axios';
// 导入 Component 类
import { Component } from 'react';

class LoongListView extends Component {
    constructor(props){
        super(props);
        this.state = {
            loongs: null
        }
    }
    render(){
        const loongs = this.state.loongs;
        return (
            <div className="list">
                { loongs && loongs.map( x => <div key={ x.id }> { x.id } , { x.name } , {x.gender}</div>) }
            </div>
        )
    }
    componentDidMount(){
        this.fetchData();
    }
    fetchData(){
        const promise = axios.get( '/back/loong/list' );
        promise.then( resp => {
            let data = resp.data ;
            if( data.success ) {
                let array = data.result ;
                this.setState( { loongs: array });
                return;
            }
            // 查询失败
            console.log( data.message , data.result );
        }).catch( cause => {
            console.log( cause );
        });
    }
}

export default LoongListView;